<template>
    <div class="appBody">
        <div class="nav">
            <nav class="navbar navbar-default" style="padding:0 10px;">
                <div class="container-fluid">
                    <!-- Brand and toggle get grouped for better mobile display -->
                    <div class="navbar-header">
                        <!-- <button
                            type="button"
                            class="navbar-toggle collapsed"
                            data-toggle="collapse"
                            data-target="#bs-example-navbar-collapse-1"
                            aria-expanded="false"
                        >
                            <span class="sr-only"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>-->
                        <div class="hi">
                            <div class="dropdown">
                                <i
                                    class="el-icon-user-solid navbar-toggle collapsed"
                                    @click="showMenu('2')"
                                >
                                    <el-badge is-dot v-if="newMes"></el-badge>
                                </i>
                                <transition name="fadeDown">
                                    <ul
                                        class="dropdown-menu"
                                        style="top: 50px;right: 0;left: auto;display: block;padding-top: 10px;"
                                        v-if="showDown == 2 "
                                        @click="showMenu('0')"
                                    >
                                        <li>
                                            <router-link to="/person/news">
                                                消息通知
                                                <el-badge :value="1" v-if="newMes"></el-badge>
                                            </router-link>
                                        </li>
                                        <li>
                                            <router-link to="/person/articleList">管理发布</router-link>
                                        </li>
                                        <li>
                                            <router-link to="/person/collect">收藏关注</router-link>
                                        </li>
                                        <li role="separator" class="divider"></li>
                                        <li>
                                            <router-link to="/person/install">设置</router-link>
                                        </li>
                                    </ul>
                                </transition>
                            </div>
                            <i
                                class="el-icon-search navbar-toggle collapsed"
                                title="搜索"
                                @click="navTo('/seek')"
                            ></i>
                            <div class="dropdown">
                                <i
                                    class="el-icon-tickets navbar-toggle collapsed"
                                    @click="showMenu('1')"
                                ></i>
                                <transition name="fadeDown">
                                    <ul
                                        class="dropdown-menu"
                                        style="top: 50px;right: 0;left: auto;display: block;padding-top: 10px;"
                                        v-if="showDown == 1 "
                                        @click="showMenu('0')"
                                    >
                                        <li>
                                            <router-link to="/strategy">游记攻略</router-link>
                                        </li>
                                        <li>
                                            <router-link to="/team">结伴同游</router-link>
                                        </li>
                                        <li>
                                            <router-link to="/hot">热门精选</router-link>
                                        </li>
                                    </ul>
                                </transition>
                            </div>
                            <i
                                class="el-icon-s-home navbar-toggle collapsed"
                                @click="navTo('/home')"
                            ></i>
                        </div>
                        <a class="navbar-brand" href="#" style="color:#409eff;">会生活</a>
                    </div>

                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                        <ul class="nav navbar-nav">
                            <li>
                                <router-link
                                    to="/home"
                                    :class="bgData=='home'?'bg':''"
                                    aria-expanded="false"
                                >首页</router-link>
                            </li>
                            <li>
                                <router-link
                                    to="/strategy"
                                    :class="bgData=='strategy'?'bg':''"
                                    aria-expanded="false"
                                >游记攻略</router-link>
                            </li>
                            <li>
                                <router-link
                                    to="/team"
                                    :class="bgData=='team'?'bg':''"
                                    aria-expanded="false"
                                >结伴同游</router-link>
                            </li>
                            <li>
                                <router-link
                                    to="/hot"
                                    :class="bgData=='hot'?'bg':''"
                                    aria-expanded="false"
                                >热门精选</router-link>
                            </li>
                        </ul>
                        <ul class="nav navbar-nav navbar-right nohi">
                            <li>
                                <form class="navbar-form navbar-left">
                                    <div class="form-group">
                                        <input
                                            type="text"
                                            class="form-control"
                                            placeholder="搜索"
                                            style="backgroundColor:#eee;"
                                            @click="gotoSeek"
                                            v-model="seekNav"
                                        />
                                    </div>
                                </form>
                            </li>
                            <li class="dropdown nohi">
                                <router-link to="/dl" class="dropdown-toggle" v-if="!user">点击登陆</router-link>
                                <router-link to="#" class="dropdown-toggle" v-if="user">
                                    {{user}}
                                    <el-badge
                                        value="new"
                                        style="position: absolute;right: 5px;top: 10px;"
                                        v-if="newMes"
                                    ></el-badge>
                                    <span class="caret"></span>
                                </router-link>
                                <ul class="dropdown-menu" v-if="user">
                                    <li>
                                        <router-link to="/person/news">
                                            消息通知
                                            <el-badge :value="newMes" v-if="newMes"></el-badge>
                                        </router-link>
                                    </li>
                                    <li>
                                        <router-link to="/person/articleList">管理发布</router-link>
                                    </li>
                                    <li>
                                        <router-link to="/person/collect">收藏关注</router-link>
                                    </li>
                                    <li role="separator" class="divider"></li>
                                    <li>
                                        <router-link to="/person/install">设置</router-link>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                    <!-- /.navbar-collapse -->
                </div>
                <!-- /.container-fluid -->
            </nav>
        </div>
        <div class="feedback" data-toggle="modal" data-target="#myModal">
            <i class="el-icon-s-comment"></i>
        </div>
        <el-backtop :visibility-height="500" :right="20" :bottom="100" title="返回顶部"></el-backtop>
        <!-- Modal -->
        <div
            class="modal fade"
            id="myModal"
            tabindex="-1"
            role="dialog"
            aria-labelledby="myModalLabel"
        >
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                        <h4 class="modal-title" id="myModalLabel">问题反馈</h4>
                        <el-form ref="form" :model="form">
                            <el-input type="textarea" v-model="form.desc" rows="5"></el-input>
                        </el-form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-primary" @click="feedback">反馈</button>
                    </div>
                </div>
            </div>
        </div>
        <!-- 中间的 路由 router-view 区域 -->
        <transition name="fadeLeft" mode="out-in">
            <router-view style="animation-duration:0.6s;min-height:490px;"></router-view>
        </transition>
        <div class="footer">
            <p>
                ©2020 yiqiyou.com, All Rights Reserved
                <svg
                    xmlns="http://www.w3.org/2000/svg"
                    t="1585917715220"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    p-id="1251"
                    width="16"
                    height="16"
                >
                    <path
                        d="M851.4 590.193c-22.196-66.233-90.385-90.422-105.912-91.863-15.523-1.442-29.593-9.94-19.295-27.505 10.302-17.566 29.304-68.684-7.248-104.681-36.564-36.14-116.512-22.462-173.094 0.866-56.434 23.327-53.39 7.055-51.65-8.925 1.89-16.848 32.355-111.02-60.791-122.395C311.395 220.86 154.85 370.754 99.572 457.15 16 587.607 29.208 675.873 29.208 675.873h0.58c10.009 121.819 190.787 218.869 412.328 218.869 190.5 0 350.961-71.853 398.402-169.478 0 0 0.143-0.433 0.575-1.156 4.938-10.506 8.71-21.168 11.035-32.254 6.668-26.205 11.755-64.215-0.728-101.66z m-436.7 251.27c-157.71 0-285.674-84.095-285.674-187.768 0-103.671 127.82-187.76 285.674-187.76 157.705 0 285.673 84.089 285.673 187.76 0 103.815-127.968 187.768-285.673 187.768z"
                        fill="#d81e06"
                        p-id="1252"
                    />
                    <path
                        d="M803.096 425.327c2.896 1.298 5.945 1.869 8.994 1.869 8.993 0 17.7-5.328 21.323-14.112 5.95-13.964 8.993-28.793 8.993-44.205 0-62.488-51.208-113.321-114.181-113.321-15.379 0-30.32 3.022-44.396 8.926-11.755 4.896-17.263 18.432-12.335 30.24 4.933 11.662 18.572 17.134 30.465 12.238 8.419-3.46 17.268-5.33 26.41-5.33 37.431 0 67.752 30.241 67.752 67.247 0 9.068-1.735 17.857-5.369 26.202a22.832 22.832 0 0 0 12.335 30.236l0.01 0.01z"
                        fill="#d81e06"
                        p-id="1253"
                    />
                    <path
                        d="M726.922 114.157c-25.969 0-51.65 3.744-76.315 10.942-18.423 5.472-28.868 24.622-23.5 42.91 5.509 18.29 24.804 28.657 43.237 23.329a201.888 201.888 0 0 1 56.578-8.064c109.253 0 198.189 88.271 198.189 196.696 0 19.436-2.905 38.729-8.419 57.16-5.508 18.289 4.79 37.588 23.212 43.053 3.342 1.014 6.817 1.442 10.159 1.442 14.943 0 28.725-9.648 33.37-24.48 7.547-24.906 11.462-50.826 11.462-77.175-0.143-146.588-120.278-265.813-267.973-265.813z"
                        fill="#d81e06"
                        p-id="1254"
                    />
                    <path
                        d="M388.294 534.47c-84.151 0-152.34 59.178-152.34 132.334 0 73.141 68.189 132.328 152.34 132.328 84.148 0 152.337-59.182 152.337-132.328 0-73.15-68.19-132.334-152.337-132.334zM338.53 752.763c-29.454 0-53.39-23.755-53.39-52.987 0-29.228 23.941-52.989 53.39-52.989 29.453 0 53.39 23.76 53.39 52.989 0 29.227-23.937 52.987-53.39 52.987z m99.82-95.465c-6.382 11.086-19.296 15.696-28.726 10.219-9.43-5.323-11.75-18.717-5.37-29.803 6.386-11.09 19.297-15.7 28.725-10.224 9.43 5.472 11.755 18.864 5.37 29.808z"
                        fill="#d81e06"
                        p-id="1255"
                    />
                </svg>
                <svg
                    xmlns="http://www.w3.org/2000/svg"
                    t="1585917971770"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    p-id="2684"
                    width="16"
                    height="16"
                >
                    <path
                        d="M964.576 251.424C931.424 265.728 895.424 276 858.272 280 896.576 257.152 925.728 221.152 939.424 178.304 904 199.424 864 214.848 822.272 222.848 788.576 186.848 740.576 164.576 687.424 164.576 585.152 164.576 502.848 247.424 502.848 349.152 502.848 363.424 504.576 377.728 507.424 391.424 354.272 383.424 217.728 310.304 126.848 198.304 110.848 225.728 101.728 257.152 101.728 291.424 101.728 355.424 134.272 412 184 445.152 153.728 444 125.152 435.424 100.576 421.728L100.576 424C100.576 513.728 164 588 248.576 605.152 233.152 609.152 216.576 611.424 200 611.424 188 611.424 176.576 610.304 165.152 608.576 188.576 681.728 256.576 734.848 337.728 736.576 274.272 786.304 194.848 815.424 108.576 815.424 93.152 815.424 78.848 814.848 64 813.152 145.728 865.728 242.848 896 347.424 896 686.848 896 872.576 614.848 872.576 370.848 872.576 362.848 872.576 354.848 872 346.848 908 320.576 939.424 288 964.576 251.424Z"
                        p-id="2685"
                        fill="#1296db"
                    />
                </svg>
                <svg
                    xmlns="http://www.w3.org/2000/svg"
                    t="1585918054931"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    p-id="3564"
                    width="16"
                    height="16"
                >
                    <path
                        d="M928 0H96C43.2 0 0 43.2 0 96v832c0 52.8 43.2 96 96 96h832c52.8 0 96-43.2 96-96V96c0-52.8-43.2-96-96-96zM384 832H256V384h128v448z m-64-512c-35.392 0-64-28.608-64-64s28.608-64 64-64c35.392 0 64 28.608 64 64s-28.608 64-64 64z m512 512h-128v-256c0-35.392-28.608-64-64-64s-64 28.608-64 64v256h-128V384h128v79.392C602.4 427.2 642.784 384 688 384c79.616 0 144 71.616 144 160v288z"
                        p-id="3565"
                        fill="#1296db"
                    />
                </svg>
                <svg
                    t="1585918118882"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    xmlns="http://www.w3.org/2000/svg"
                    version="1.1"
                    p-id="4705"
                    width="16"
                    height="16"
                >
                    <path
                        d="M1024 619.52c0-143.36-138.24-256-307.2-256s-307.2 112.64-307.2 256 138.24 256 307.2 256c30.72 0 61.44-5.12 92.16-10.24l97.28 51.2-25.6-76.8c87.04-51.2 143.36-128 143.36-220.16z m-414.72-40.96c-30.72 0-51.2-20.48-51.2-51.2s20.48-51.2 51.2-51.2 51.2 20.48 51.2 51.2c0 25.6-25.6 51.2-51.2 51.2z m209.92 0c-30.72 0-51.2-20.48-51.2-51.2s20.48-51.2 51.2-51.2 51.2 20.48 51.2 51.2c0 25.6-25.6 51.2-51.2 51.2z"
                        fill="#4CBF00"
                        p-id="4706"
                    />
                    <path
                        d="M358.4 609.28c0-158.72 153.6-286.72 348.16-286.72h15.36c-40.96-133.12-179.2-235.52-353.28-235.52-204.8 0-368.64 138.24-368.64 307.2 0 107.52 66.56 204.8 168.96 256l-30.72 92.16L256 686.08c35.84 10.24 71.68 15.36 112.64 15.36h10.24c-15.36-30.72-20.48-61.44-20.48-92.16z m138.24-414.72c35.84 0 66.56 30.72 66.56 66.56s-30.72 66.56-66.56 66.56C460.8 322.56 430.08 291.84 430.08 256S460.8 194.56 496.64 194.56zM245.76 322.56c-35.84 0-61.44-30.72-61.44-66.56s30.72-66.56 66.56-66.56 61.44 30.72 61.44 66.56-30.72 66.56-66.56 66.56z"
                        fill="#4CBF00"
                        p-id="4707"
                    />
                </svg>
                <svg
                    t="1585918260930"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="5086"
                    width="16"
                    height="16"
                >
                    <path
                        d="M1012.8 148.8v620.8h-32c-19.2 0-36.8 3.2-56 3.2l-49.6 3.2-84.8 3.2-52.8 3.2-81.6 3.2-52.8 3.2-78.4 3.2c-19.2 0-33.6 3.2-52.8 3.2l-84.8 6.4c-19.2 0-33.6 3.2-52.8 3.2l-84.8 3.2c-19.2 0-33.6 3.2-52.8 3.2l-81.6 6.4c-19.2 0-33.6 3.2-52.8 3.2l-56 3.2v-624h19.2c32-3.2 59.2-3.2 88-3.2l56-3.2 88-3.2 59.2-3.2 88-3.2 52.8-3.2 59.2-3.2 59.2-3.2 84.8-3.2 56-3.2 59.2-3.2 59.2-3.2 59.2-3.2 56-3.2c3.2-3.2 62.4-6.4 62.4-6.4zM785.6 411.2c9.6-3.2 16-9.6 25.6-12.8 28.8-12.8 56-28.8 81.6-40 9.6-3.2 12.8-9.6 12.8-19.2v-70.4c-6.4 0-12.8 3.2-16 3.2-28.8 3.2-56 3.2-84.8 3.2-16 0-33.6 3.2-49.6 3.2-25.6 0-46.4 3.2-72 3.2H664c-19.2-9.6-36.8-16-56-25.6l-3.2 3.2c-22.4 36.8-46.4 72-68.8 108.8-3.2 6.4 0 6.4 3.2 6.4 16 6.4 32 12.8 46.4 19.2 9.6 3.2 12.8 0 16-6.4 9.6-16 22.4-33.6 32-49.6 0-3.2 3.2-3.2 6.4-3.2 9.6 0 16 0 25.6-3.2 16 0 33.6-3.2 49.6-3.2 25.6 0 46.4-3.2 72-3.2h9.6c12.8 0 25.6 0 36.8-3.2 3.2 9.6 0 9.6-6.4 12.8-32 16-65.6 32-96 46.4-3.2 0-6.4 3.2-9.6 0-22.4-6.4-43.2-16-62.4-25.6-16-6.4-16-6.4-25.6 9.6 0 3.2-3.2 3.2-3.2 6.4-6.4 9.6-12.8 16-16 25.6l49.6 19.2c-28.8 12.8-52.8 28.8-81.6 40-3.2 3.2-6.4 3.2-9.6 3.2h-25.6v46.4h43.2c3.2 0 6.4 0 9.6-3.2 36.8-19.2 72-33.6 108.8-52.8 12.8-6.4 25.6-9.6 40-3.2 28.8 12.8 56 22.4 84.8 32 16 6.4 28.8 12.8 43.2 12.8 6.4 0 12.8 0 19.2-3.2l19.2-3.2v-49.6c-6.4 0-12.8 3.2-19.2 3.2h-19.2c-12.8-3.2-25.6-9.6-33.6-12.8-27.2-4.8-43.2-8-57.6-14.4z m-459.2-108.8V512c-19.2 0-36.8 3.2-56 3.2-28.8 3.2-56 3.2-84.8 3.2-16 0-28.8 0-43.2 3.2-9.6 0-19.2 0-28.8 3.2v49.6l147.2-9.6c-19.2 25.6-36.8 46.4-52.8 72-6.4 9.6-16 16-28.8 16H142.4c-9.6 0-19.2 0-28.8 3.2v43.2c0 3.2 3.2 3.2 6.4 3.2 28.8-3.2 56-3.2 88-6.4 12.8 0 28.8 0 40-3.2 3.2 0 3.2 0 6.4-3.2 9.6-12.8 16-22.4 25.6-33.6 22.4-28.8 43.2-56 62.4-84.8 6.4-6.4 9.6-16 22.4-16 28.8 0 56-3.2 84.8-3.2 12.8 0 25.6 0 33.6-3.2 3.2 0 6.4-3.2 6.4-3.2v-40l-3.2-3.2c-16 0-32 0-46.4 3.2-12.8 0-25.6 3.2-36.8 3.2V299.2l-76.8 3.2z m206.4 268.8h6.4c16 0 32-3.2 43.2-3.2 16 0 32 0 46.4-3.2h9.6l43.2-3.2v102.4l75.2-3.2v-102.4c6.4 0 12.8-3.2 19.2-3.2 19.2 0 33.6-3.2 52.8-3.2 25.6 0 46.4-3.2 72-3.2h6.4v-49.6c-12.8 0-28.8 3.2-40 3.2-25.6 0-46.4 3.2-72 3.2h-6.4c-9.6 0-19.2 0-32 3.2v-25.6l-75.2 3.2V512c-19.2 0-36.8 3.2-56 3.2-25.6 0-46.4 3.2-72 3.2-6.4 0-12.8 0-19.2 3.2-1.6 1.6-1.6 49.6-1.6 49.6z m-172.8-3.2l56 115.2 81.6-3.2v-3.2c-16-33.6-33.6-65.6-49.6-99.2-3.2-9.6-9.6-12.8-19.2-9.6-9.6 0-19.2 0-28.8 3.2-11.2-3.2-24-3.2-40-3.2z m172.8 108.8h9.6c19.2 0 36.8-3.2 56-3.2 6.4 0 6.4-3.2 9.6-6.4 12.8-22.4 25.6-43.2 33.6-68.8 3.2-6.4 6.4-16 12.8-22.4-6.4 0-12.8 3.2-19.2 3.2-16 0-28.8 0-43.2 3.2-6.4 0-12.8 3.2-16 9.6-3.2 9.6-9.6 16-12.8 22.4l-30.4 62.4z m387.2-22.4v-3.2l-46.4-81.6c-3.2-3.2-6.4-6.4-9.6-6.4-19.2 3.2-36.8 3.2-56 3.2-3.2 0-9.6 0-12.8 3.2 16 28.8 33.6 56 49.6 84.8 0 3.2 3.2 6.4 6.4 6.4h46.4c9.6-6.4 16-6.4 22.4-6.4zM286.4 486.4c-16-22.4-32-40-46.4-59.2-6.4-9.6-12.8-16-25.6-16-16 3.2-32 3.2-46.4 3.2-6.4 0-12.8 0-16 3.2v3.2c16 19.2 32 40 46.4 59.2 6.4 9.6 12.8 12.8 25.6 12.8 19.2-3.2 36.8-3.2 59.2-3.2 0 0 0-3.2 3.2-3.2z m1.6-91.2c-3.2-3.2-3.2-6.4-6.4-9.6-12.8-16-25.6-32-36.8-49.6-9.6-9.6-16-19.2-32-16-12.8 3.2-25.6 0-36.8 3.2-9.6 0-16 0-25.6 3.2 19.2 25.6 36.8 49.6 56 72 0 3.2 3.2 3.2 6.4 3.2 16 0 32-3.2 46.4-3.2 1.6 0 28.8-3.2 28.8-3.2z"
                        fill="#d81e06"
                        p-id="5087"
                    />
                </svg>
                <svg
                    t="1585918432048"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="5956"
                    width="16"
                    height="16"
                >
                    <path
                        d="M544.059897 959.266898h-64.949141c-228.633593 0-415.697442-187.063849-415.697442-415.697442v-64.949141c0-228.633593 187.063849-415.697442 415.697442-415.697442h64.949141c228.633593 0 415.697442 187.063849 415.697442 415.697442v64.949141c-0.001024 228.633593-187.064873 415.697442-415.697442 415.697442z"
                        fill="#006CE2"
                        p-id="5957"
                    />
                    <path
                        d="M513.358696 494.912378h-84.12549c1.331051-13.311533 4.791783-49.517142 4.791783-70.01635 0-20.499208-0.26621-50.049562-0.26621-50.049563h84.65791v-13.311533c0-17.837106-7.720095-25.823412-14.110163-25.823412H357.08615s4.259363-14.642584 8.252516-29.816564c3.993153-15.175004 13.045323-36.471819 13.045323-36.471819-51.913034 3.460732-55.995265 41.974179-67.354248 76.405394-11.358984 34.431216-20.232998 51.380613-36.73803 88.917273 22.8951 0 45.523989-11.180828 55.107556-26.622042 9.583567-15.441215 13.932008-33.543507 13.932008-33.543507h51.114403v48.629434c0 17.39274-3.194522 72.056954-3.194522 72.056953h-91.225111c-15.973635 0-24.492361 40.28784-24.492361 40.28784h110.215112c-6.921465 62.473387-21.830259 87.498168-42.772809 125.833459-20.94255 38.336314-76.405395 81.907754-76.405395 81.907754 33.809717 9.583567 71.347401-2.928312 87.320012-18.103317 15.973635-15.175004 29.550354-40.998416 39.401155-60.017086 9.849777-19.01867 18.103316-53.659782 18.103317-53.659782l89.449693 110.481322s3.993153-19.966788 5.324204-32.478666c1.331051-12.512903-0.621498-21.741181-3.816021-29.19609-3.194522-7.453885-12.778089-17.748028-25.557201-32.656823-12.778089-14.908794-39.578287-43.57144-39.578287-43.57144s-13.045323 9.583567-23.16131 17.304686c7.453885-18.103316 13.399587-65.667909 13.399587-65.667909h100.808677v-16.683187c0.002048-14.551458-6.031708-24.135025-14.905722-24.135025zM750.117843 329.500632H557.019214a3.54981 3.54981 0 0 0-3.549811 3.54981v358.510375a3.54981 3.54981 0 0 0 3.549811 3.549811h33.145216l12.112563 41.530836 66.820804-41.530836h81.020046a3.54981 3.54981 0 0 0 3.54981-3.549811V333.050442a3.54981 3.54981 0 0 0-3.54981-3.54981zM713.024525 654.112211h-43.128097l-50.714064 32.212457-8.918042-32.212457h-15.441214V368.723631h118.202441V654.112211z"
                        fill="#FFFFFF"
                        p-id="5958"
                    />
                </svg>
            </p>
        </div>
    </div>
</template>
<script>
import vue from "vue";
import $global from "./Global.js";
vue.prototype.$global = $global;
export default {
    provide() {
        //父组件中通过provide来提供变量，在子组件中通过inject来注入变量。
        return {
            reload: this.reload
        };
    },

    data() {
        return {
            bgData: "",
            form: {
                desc: ""
            },
            direction: "ttb",
            showDown: 0,
            seekNav: "",
            user: this.$global.user,
            newMes: this.$global.newMes
        };
    },
    methods: {
        feedback() {
            // console.log(this.$data.form.desc);
            if (this.$data.form.desc != "") {
                this.$message({
                    type: "success",
                    message: "反馈成功"
                });
                $("#myModal").modal("toggle");
            }
        },
        navBg() {
            this.$data.bgData = this.$route.path.split("/")[1];
        },
        navTo(path) {
            if (this.$route.path != path) {
                this.$router.push(path);
            }
        },
        showMenu(num) {
            if (this.$data.showDown == num) {
                //隐藏
                this.$data.showDown = 0;
            } else {
                //显示
                if (this.user) {
                    this.$data.showDown = num;
                } else {
                    this.$router.push({
                        path: "/dl",
                        query: { path: this.$route.path }
                    });
                }
            }
        },
        gotoSeek(e) {
            if (this.$route.path.split("/")[1] != "seek") {
                this.$router.push("/seek");
                e.srcElement.blur();
                this.seekNav = "";
            } else {
                e.srcElement.blur();
            }
        },
        reload() {
            this.user = this.$global.user;
            this.newMes = this.$global.newMes;
        }
    },
    mounted() {
        this.navBg();
    },
    watch: {
        $route: function(to, from) {
            document.body.scrollTop = 0;
            document.documentElement.scrollTop = 0;
            this.navBg();
        }
    }
};
</script>
<style>
div.appBody {
    /* background-color: rgba(238, 238, 238, 0.486); */
    min-height: 450px;
}
div.appBody div.nav nav.navbar a.bg {
    border-bottom: 2px solid #0084ffbe;
}
/* 下拉菜单自动触发 */
div.appBody div.collapse .dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
}
/* 导航条 */
div.appBody div.nav {
    font-weight: 700;
    font-size: 15px;
}
div.appBody div.nav nav.navbar {
    /* padding: 0 20px; */
    margin-bottom: 0.125rem;
    /* background-color: rgba(0, 132, 255, 0.199); */
}

div.appBody div.nav div .nav > li > a {
    padding: 15px 20px;
}

/* nav */
@media screen and (max-width: 945px) {
    div.appBody ul.navbar-right li:first-child input {
        width: 150px;
    }
}
@media (max-width: 840px) {
    div.appBody div.nav div .nav > li > a {
        padding: 15px 13px;
    }
}

/* hi  nohi */
@media (max-width: 768px) {
    .nohi {
        display: none;
    }
    .hi {
        display: inline;
    }
}
@media (min-width: 768px) {
    .nohi {
        display: inline;
    }
    .hi {
        display: none;
    }
}
/* 反馈 */
div.appBody div.feedback {
    right: 20px;
    bottom: 40px;
    position: fixed;
    background-color: #fff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 20px;
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    z-index: 5;
    color: #409eff;
}
div.panel-primary > .panel-heading {
    background-color: rgba(0, 132, 255, 0.897);
}

div.appBody .el-badge__content.is-fixed {
    right: 3px;
}
div.appBody .hi .dropdown i:first-child .el-badge {
    position: absolute;
    top: 1px;
    right: 0;
}

/* text隐藏（···） */
div.hiddenText {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

/* footer */
div.footer {
    /* position: absolute;
    bottom: 0px; */
    margin: 10px 0;
    text-align: center;
}
div.footer svg {
    margin: 0 5px;
}
</style>